﻿<FluentStack Orientation="Orientation.Vertical" VerticalGap="5">
    <div>
        <FluentSwitch @bind-Value="@(enabled)" CheckedMessage="Pull is enabled" UncheckedMessage="Pull is disabled" />
        <FluentSwitch @bind-Value="@direction" CheckedMessage="Pull up" UncheckedMessage="Pull down" />
    </div>
    <FluentPullToRefresh Style="border: calc(var(--stroke-width)* 1px) solid var(--neutral-stroke-rest); border-radius: calc(var(--control-corner-radius)* 1px); width: 100%;"
                         Disabled="@(!enabled)"
                         Direction="@(direction ? PullDirection.Up : PullDirection.Down)"
                         OnRefreshAsync="OnRefreshAsync">
        <div style="height: 150px; width: 100%; padding: 5px;">
            Content to refresh. Pull counter: @Counter
        </div>
    </FluentPullToRefresh>
</FluentStack>

@code {
    bool enabled = true;
    bool direction = false;
    int Counter = 0;

    async Task<bool> OnRefreshAsync()
    {
        Counter++;
        await Task.Delay(250);
        return true;
    }
}
